import React from "react";
import Footer from "../../components/common/footer/index";
import { Head, Catalog, PopUp } from "./style";
import { connect } from "react-redux";
import { getUserInfo} from "../../store/actions";
import {tips} from '../../api'
import { Modal } from 'antd-mobile'

const jf = require("../../assets/img_jf.png");
const tj = require("../../assets/img_tj.png");
const fk = require("../../assets/img_fk.png");
let isAuth = JSON.parse(localStorage.getItem('auth'))
let m = ''

if (!isAuth) {
  isAuth = {
    has_studed: 0,
    has_worked: 0,
    has_activated: 0
  }
}
class Index extends React.PureComponent {
  state = {
    isPopShow: !(isAuth.has_studed && isAuth.has_worked && isAuth.has_activated),
    tips: ''
  }
  componentDidMount() {
    // this.props.login();
    let s = this.props.location.search.split('&')

    if (window.location.href.indexOf('openid')>-1 && s[0].split('=')[1]) {
      this.props.login(s[0].split('=')[1]);
    } else {
      // if (!sessionStorage.getItem("userInfo")) {
      //   window.location.href = 'http://www.yermn.com/api/auth/login?url=http://www.yermn.com/#/me'
      // }
    }
    if (window.location.href.indexOf('openid')>-1 && Number(s[1].split('=')[1]) === 0) {
      this.setState({
        isPopShow: false
      })
      m = Modal.alert('提示', '亲，请先关注“YER渼伱”公众号', [
        { text: '我知道了', onPress: () => {localStorage.removeItem('userInfo')} }
      ])
    }
    

    tips().then(res => {
      if (res.data.code === 0) {
        this.setState({
          tips: res.data.data.tips
        })
      }
    })
  }
  goHelp(){
    this.props.history.push("/help/");
  }
  goShare(){
    this.props.history.push("/invite/");
  }
  hidePopXx() {
    this.setState({
      isPopShow: false
    })
  }
  componentWillUnmount () {
    m && m.close()
  }
  render() {
    isAuth = JSON.parse(localStorage.getItem('auth'))
    return (
      <div>
        {this.props.userInfo ? (
          <Head>
            <div className="bg" />
            <div className="mp">
              <img src={this.props.userInfo.avatar} alt="" />
              <p>
                {this.props.userInfo.nickname}
                <br />
                {this.props.userInfo.phone}
              </p>
            </div>
          </Head>
        ) : (
          ""
        )}
        <Catalog>
          <li onClick={this.goShare.bind(this)}>
            <img src={tj} alt="" />
            推荐有奖
          </li>
          <li onClick={this.goHelp.bind(this)}>
            <img src={fk} alt="" />
            反馈与帮助
          </li>
          {this.props.userInfo && <li className="no">
            <span>{this.props.userInfo.integral}</span>
            <img src={jf} alt="" />
            {this.props.userInfo.openid}
          </li>}
        </Catalog>
        <Footer atthis="me" />

        <PopUp className={this.state.isPopShow && this.state.tips ? 'show' : ''}>
          <div className="content">
            <h2>温馨提示</h2>
            <p>
              {this.state.tips}
            </p>
            <b onClick={this.hidePopXx.bind(this)}>确定</b>
            <i className="iconfont" onClick={this.hidePopXx.bind(this)}>
              &#xe628;
            </i>
          </div>
        </PopUp>
      </div>
    );
  }
}
const mapStateToProps = state => ({
  userInfo: state.userInfo
});
const mapDispatchToProps = dispatch => ({
  login: (openId) => dispatch(getUserInfo(openId))
});
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Index);
